<template>
  <div class="backStage">
    <!-- 菜单头 -->
    <div class="login_title">
      <img src="@/assets/img/logo1.png" alt="" />
      <div class="logo_text">
        客服系统
        <el-button type="danger" @click="exit()" plain>退出</el-button>
      </div>
    </div>
    <!-- 下拉菜单 -->
    <el-menu
      :default-active="activeIndex"
      class="menu"
      text-color="#d7d7d7"
      background-color="#242930"
      active-text-color="#0eafc0"
      :default-openeds="handleOpeneds"
      :router="true"
    >
      <el-menu-item index="/WorkerBG/messageList"
        ><i class="el-icon-chat-line-round"></i>影院留言</el-menu-item
      >
      <el-menu-item index="/WorkerBG/activityList"
        ><i class="el-icon-collection-tag"></i>活动安排
      </el-menu-item>
      <el-menu-item index="#"
        ><i class="el-icon-data-line"></i>信息统计</el-menu-item
      >
      <el-menu-item index="/WorkerBG/evaluationList"
        ><i class="el-icon-edit-outline"></i>我的评价</el-menu-item
      >
      <el-menu-item index="/WorkerBG/Set"
        ><i class="el-icon-setting"></i>个人设置</el-menu-item
      >
    </el-menu>
    <!-- 主要内容 -->
    <div class="right">
      <router-view />
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      activeIndex: this.$route.path,
      handleOpeneds: ["1", "2", "3", "4"],
    };
  },
  mounted() {},
  methods: {
    active(index) {
      localStorage.setItem("active", index);
      this.activeIndex = index;
    },
    exit(){
      localStorage.removeItem("wid")
      this.$router.push("/login")
    }
  },
};
</script>
<style lang="scss" scoped>
.backStage {
  width: 1440px;
  height: 936px;
  position: relative;
  margin: 0 auto;
  .login_title {
    width: 350px;
    height: 100%;
    background-color: rgb(36, 41, 48);
    img {
      width: 50px;
      height: 50px;
      float: left;
      margin-left: 20px;
      margin-top: 20px;
    }
    .logo_text {
      color: rgb(215, 215, 215);
      line-height: 75px;
      font-size: 25px;
      font-weight: bold;
      margin-left: 50px;
      padding-left: 60px;
    }
  }
  .menu {
    width: 350px;
    position: absolute;
    top: 75px;
    * {
      padding-left: 20px;
      font-size: 20px;
      font-weight: bold;
    }
  }
  .right {
    height: 100%;
    width: 1190px;
    position: absolute;
    left: 350px;
    top: 0px;
    background-color: rgb(215, 215, 215);
  }
}
</style>